<template>
    <el-row>
      <el-col :span="24">
        <Portlet title="商家信息">
          <el-form label-position="left" label-width="120px">
            <el-row>
              <el-col :lg="6" :md="12">
                <el-form-item label="商家编号："> <span>{{cargoOwnerInfo.cargoOwnerCode}}</span> </el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="商家名称："> <span>{{cargoOwnerInfo.cargoOwnerName}}</span> </el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="商家联系人："> <span>{{cargoOwnerInfo.cargoOwnerPrin}}</span></el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="联系电话："> <span> {{cargoOwnerInfo.cargoOwnerPhone}}</span> </el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="在库订单："> <span>{{cargoOwnerInfo.totalOrder}}</span></el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="总包件："> <span>{{cargoOwnerInfo.totalPackage}}  </span></el-form-item>
              </el-col>
              <el-col :lg="6" :md="12">
                <el-form-item label="总体积："> <span>{{cargoOwnerInfo.totalVolume}}  m³ </span></el-form-item>
              </el-col>
              <!--<el-col :lg="8" :md="12">-->
              <!--<el-form-item label="包件库位："> <span>{{cargoOwnerInfo.location}}</span></el-form-item>-->
              <!--</el-col>-->
              <el-col :lg="6" :md="12">
                <el-form-item label="总重量："> <span>{{cargoOwnerInfo.totalWeight}}  kg </span></el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </Portlet>
      </el-col>

      <el-col :span="24">
        <el-card>
          <el-form ref="searchForm" class="el-form-col search-form" :model="search">
            <el-row :gutter="15">
              <el-col :lg="4" :md="6">
                <el-form-item  prop="orderNo">
                  <el-input v-model="search.orderNo" placeholder="订单号"></el-input>
                </el-form-item>
              </el-col>
              <el-col :lg="4" :md="6">
                <el-form-item  prop="inputWarehouseNo">
                  <el-input v-model="search.inputWarehouseNo" placeholder="入库单号"></el-input>
                </el-form-item>
              </el-col>
              <el-col :lg="4" :md="6">
                <el-form-item  prop="consigneName">
                  <el-input v-model="search.consigneName" placeholder="客户姓名"></el-input>
                </el-form-item>
              </el-col>
              <el-col :lg="4" :md="6">
                <el-form-item prop="consignePhone">
                  <el-input v-model="search.consignePhone" placeholder="客户电话"></el-input>
                </el-form-item>
              </el-col>
              <el-col :lg="4" :md="6">
                <el-form-item prop="warehouseId">
                  <el-select v-model="search.warehouseId" clearable filterable placeholder="请选择入库仓">
                    <el-option v-for="item in warehouseIdArr"
                               :key="item.value"
                               :label="item.text"
                               :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :lg="4" :md="6">
                <el-form-item>
                  <el-row class="search-btns" :gutter="5">
                    <el-col :span="12">
                      <el-button type="primary" :loading="searchLoading" plain native-type="submit" @click.prevent="searchFunc(search)"><span>查询</span></el-button>
                    </el-col>
                    <!--<el-col :span="8">-->
                    <!--<el-button type="primary" plain @click="searchOpen = !searchOpen">{{ searchOpen ? '收起' : '展开' }}</el-button>-->
                    <!--</el-col>-->
                    <el-col :span="12">
                      <el-button @click="reset" plain>重置</el-button>
                    </el-col>
                  </el-row>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="24">
        <BasicTable
          ref="BasicTable"
          url="/ms-warehouse-order/fastforward/findFastForwardOrderList"
          :initParams="{cargoOwnerId: this.id}"
          :columns="columns"
        >
          <template slot="preColumn">
            <el-table-column prop="orderNo" fixed="left" width="170px" align="center" label="订单号">
              <template slot-scope="scope">
                <a href="javascript:;" @click="goEnterWarehouseDetail(scope.row)">{{ scope.row.orderNo }}</a>
                <!--<span>{{ scope.row.orderNo }}</span>-->
              </template>
            </el-table-column>
            <el-table-column prop="inputWarehouseNo" fixed="left" width="170px" align="center" label="入库单号">
              <template slot-scope="scope">
                <a href="javascript:;" class="blue-color" @click="goEnterWarehouseConfirmDetail(scope.row)">{{ scope.row.inputWarehouseNo }}</a>
              </template>
            </el-table-column>
          </template>
          <template slot="column">
            <el-table-column fixed="right" width="130px" align="center" label="操作">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  @click="goEnterWarehouseConfirmDetail(scope.row)"
                ><span>详情</span></el-button>
              </template>
            </el-table-column>
          </template>
        </BasicTable>
      </el-col>
    </el-row>
</template>
<script>
import {copy} from '@/utils'
import Pagination from '@/components/Pagination'
import {filterDataBaseDictionary, decimalNumFilter, unixTimestampFilter} from '@/filters'
import {getMyWarehouse} from '@/utils/selectOptions'
export default {
  name: 'tempStoreShow',
  components: {
    Pagination
  },
  filters: {
    unixTimestampFilter,
    filterDataBaseDictionary,
    decimalNumFilter
  },
  data() {
    return {
      id: this.$route.params.id,
      search: {
        orderNo: '',
        inputWarehouseNo: '',
        consigneName: '',
        consignePhone: '',
        warehouseId: ''
      },
      warehouseIdArr: [],
      searchOpen: false,
      isOpen: false,
      searchLoading: false,
      model: {},
      rules: {},
      cargoOwnerInfo: {},
      columns: [
        {label: '客户姓名', data: 'consigneName'},
        {label: '客户电话', data: 'consignePhone'},
        {label: '入库仓', data: 'warehouse'},
        {label: '商品数量', data: 'productNum'},
        {label: '总包件', data: 'totalPackage'},
        {label: '总体积', data: 'totalVolume'},
        {label: '总重量', data: 'totalWeight'},
        {label: '拣货员', data: 'sortingPersonName'},
        {label: '确认人', data: 'checkPersonName'},
        {
          label: '确认时间',
          width: '150px',
          data: 'checktime',
          render(data, full) {
            return unixTimestampFilter(data, 'YYYY-MM-DD hh:mm:ss')
          }
        }
        // {label: '操作', data: 'storageType'},
      ]
    }
  },
  created() {
    // 临时仓储的入库仓列表
    getMyWarehouse('CARGOSOURCETYPE02').then(arr => {
      this.warehouseIdArr = arr
    })
    this.getDetail() // 请求头部：商家信息
  },
  methods: {
    unixTimestampFilter,
    // 入库单详情
    goEnterWarehouseDetail(data) {
      this.$router.push({path: '/ss-oms/enterWarehouse/warehousing-order/show/' + data.orderId})
    },
    // 入库已确认详情
    goEnterWarehouseConfirmDetail(data) {
      this.$router.push({path: '/ss-oms/enterWarehouse/warehouse-confirm/show/' + data.orderId + '/?state=' + '4'})
    },
    searchFunc() {
      const basicTable = this.$refs.BasicTable
      if (basicTable) {
        let params = copy(this.search)
        this.searchLoading = true
        basicTable.search(params).finally(_ => {
          this.searchLoading = false
        })
      }
    },
    // reset 重置搜索框
    reset(searchForm) {
      this.$refs.searchForm.resetFields()
    },
    // 商家信息
    getDetail() {
      this.$ajax.get('/ms-warehouse-order/fastforward/findFastForwardList', {cargoOwnerId: this.id}).then(response => {
        if (!response.data) {
          return
        }
        this.cargoOwnerInfo = response.data[0] || {}
      })
    }
  }
}
</script>
